<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
    <meta name="format-detection" content="telephone=no" />
    <title>成都融微软件服务有限公司</title>
    <!-- <link rel="stylesheet" href="css/bootstrap.min.css" /> -->
    <link rel="stylesheet" href="css/animate.min.css" />
    <link rel="stylesheet" href="//at.alicdn.com/t/font_1031196_66s8datjlfd.css" />
    <link rel="stylesheet" href="js/layui/css/layui.css" />
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/headleft.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/jquery-1.11.3.js"></script>
    <script src="js/echarts.min.js"></script>
</head>

<body>
    <!-- 头部 -->
    <div class="daohang bgff">
        <script>$(".daohang").load("header.html");</script>
    </div>
    <!-- 中间内容-->
    <div class="substance">
        <div class="substance_lf">
            <!-- 左边栏目 -->
            <script>$(".substance_lf").load("left2.html");</script>
        </div>
        <div class="substance_rt huibg">
            <!-- 右边的内容 -->
            <!-- 导航 -->
            <div class="rt_tit">
                <a href="#" class="fnt_14">运营中心</a> / <a href="#" class="fnt_14">发布项目</a>
            </div>
            <div class="bgff pad15 mb20">
                <div class="ping_pd">
                    <h4 class="ping_tit">
                        项目信息
                    </h4>
                </div>
                <div class="text_cont">
                    <p class="fnt_16 col_999"> <em>项目编号：</em> 这是一条标题内容 <br>
                        <em> 项目名称：</em> 这是一条标题内容<br>
                        <em> 实施内容：</em>
                        这是一条编写摘要内容这是一条编写摘要内容这是一条编写摘要内容这是一条编写摘要内容这是一条编写摘要内容这是一条编写摘要内容这是一条这是一条编写摘要内容这是一条编写摘要内容这是一条编写摘要内容
                        编写摘要内容这编写摘要内容这是一条编写摘要内容这是一条编写</p>

                </div>
            </div>
            <div class=" ">
                <div class="erba">
                    <div class="er bgff pad15">
                        <div class="ping_pd">
                            <h4 class="ping_tit">
                                项目概览
                            </h4>
                        </div>
                        <div id="Vip" style="height: 250px;"></div>
                        <div id="Vips" style="height: 250px;"></div>
                        <div class="wanlv">
                            <h4 class="fnt_20 cent mb20 bld">今日任务完成率  </h4>
                            <div class="layui-progress wan_pro">
                                <div class="layui-progress-bar wan_bar" lay-percent="70%"></div>
                              </div>
                              <div class="wan_lst">
                                  <span style="background-color: #3377FF;"></span> &nbsp; <em class="fnt_18 col_444">完成任务数：</em> <em class="fnt_18 col_lan">4</em>
                              </div>
                              <div class="wan_lst">
                                <span style="background-color: #F35E6A;"></span> &nbsp; <em class="fnt_18 col_444">今日任务数：</em> <em class="fnt_18 col_red">10</em>
                            </div>
                        </div>
                    </div>
                    <div class="ba bgff">
                        <div class=" ">
                            <h1 class="index_tit col_lan fnt_16 mb20"> <i class="iconfont icon-icon-1"></i> 任务列表</h1>
                            <div class=" chose ">
                                <div class="layui-form-item">

                                    <div class="layui-inline">
                                        <div class="layui-input-inline">
                                            <select name="" id="" class="layui-select">
                                                <option value=""> 请选择 </option>
                                                <option value=""> 状态1 </option>
                                                <option value=""> 状态2 </option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <div class="layui-input-inline">
                                            <select name="" id="" class="layui-select">
                                                <option value=""> 请选择 </option>
                                                <option value=""> 状态1 </option>
                                                <option value=""> 状态2 </option>
                                            </select>
                                        </div>
                                    </div>
                                    <button class="layui-btn"><a href="#" style="color:#fff">查询</a></button>
                                </div>
                            </div>
                            <table class="layui-table">
                                <thead>
                                    <tr>
                                        <th> 创建时间 </th>
                                        <th> 类别 </th>
                                        <th> 任务名称 </th>
                                        <th>任务时限 </th>
                                        <th>任务进度 </th>
                                        <th> 任务状态</th>
                                        <th> 操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>2020-09-10 </td>
                                        <td> 约稿 </td>
                                        <td>推荐式影评征稿 </td>
                                        <td> 2020-09-11至2020-09-13 </td>
                                        <td>
                                            <div class="layui-progress">
                                                <div class="layui-progress-bar layui-bg-blue" lay-percent="20%"></div>
                                            </div>
                                        </td>

                                        <td><span class="col_lv"> 审核通过</span> </td>

                                        <td>
                                            <a class="layui-btn layui-btn-primary layui-btn-xs"> <i
                                                    class="iconfont icon-bianji"></i> 详情</a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>2020-09-10 </td>
                                        <td> 约稿 </td>
                                        <td>推荐式影评征稿 </td>
                                        <td> 2020-09-11至2020-09-13 </td>
                                        <td>
                                            <div class="layui-progress">
                                                <div class="layui-progress-bar layui-bg-blue" lay-percent="20%"></div>
                                            </div>
                                        </td>
                                        <td><span class="col_lan"> 审核中</span> </td>

                                        <td>
                                            <a class="layui-btn layui-btn-primary layui-btn-xs"> <i
                                                    class="iconfont icon-bianji"></i> 详情</a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>2020-09-10 </td>
                                        <td> 约稿 </td>
                                        <td>推荐式影评征稿 </td>
                                        <td> 2020-09-11至2020-09-13 </td>
                                        <td>
                                            <div class="layui-progress">
                                                <div class="layui-progress-bar layui-bg-blue" lay-percent="20%"></div>
                                            </div>
                                        </td>
                                        <td><span> 已关闭</span> </td>

                                        <td>
                                            <a class="layui-btn layui-btn-primary layui-btn-xs"> <i
                                                    class="iconfont icon-bianji"></i> 详情</a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>2020-09-10 </td>
                                        <td> 约稿 </td>
                                        <td>推荐式影评征稿 </td>
                                        <td> 2020-09-11至2020-09-13 </td>
                                        <td>
                                            <div class="layui-progress">
                                                <div class="layui-progress-bar layui-bg-blue" lay-percent="20%"></div>
                                            </div>
                                        </td>
                                        <td><span class="col_red"> 审核未通过</span> </td>

                                        <td>
                                            <a class="layui-btn layui-btn-primary layui-btn-xs"> <i
                                                    class="iconfont icon-bianji"></i> 详情</a>
                                        </td>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="22">
                                            <div class="tDiv">

                                                <div class="list-page">
                                                    <input type="hidden" id="pageurl" value="c=index">
                                                    <!-- $Id: page.lbi 14216 2008-03-10 02:27:21Z testyang $ -->
                                                    <div id="turn-page">
                                                        <span class="page page_1">总计 <em
                                                                id="totalRecords">425</em>个记录</span>
                                                        <span class="page page_2">分为<em id="totalPages">29</em>页</span>
                                                        <!--<span>页当前第<em id="pageCurrent">1</em></span>-->
                                                        <span class="page page_3">
                                                            <i>每页</i>
                                                            <input type="text" size="3" id="pageSize" value="15">
                                                        </span>
                                                        <span id="page-link">
                                                            <a href="?c=index&amp;page=1" class="first" title="第一页"></a>
                                                            <a href="?c=index&amp;page=1" class="prev" title="上一页"></a>
                                                            <select id="gotoPage">
                                                                <option value="1" selected="">1</option>
                                                                <option value="2">2</option>
                                                                <option value="3">3</option>
                                                                <option value="4">4</option>
                                                                <option value="5">5</option>
                                                                <option value="6">6</option>
                                                                <option value="7">7</option>
                                                                <option value="8">8</option>
                                                                <option value="9">9</option>
                                                                <option value="10">10</option>
                                                                <option value="11">11</option>
                                                                <option value="12">12</option>
                                                                <option value="13">13</option>
                                                                <option value="14">14</option>
                                                                <option value="15">15</option>
                                                                <option value="16">16</option>
                                                                <option value="17">17</option>
                                                                <option value="18">18</option>
                                                                <option value="19">19</option>
                                                                <option value="20">20</option>
                                                                <option value="21">21</option>
                                                                <option value="22">22</option>
                                                                <option value="23">23</option>
                                                                <option value="24">24</option>
                                                                <option value="25">25</option>
                                                                <option value="26">26</option>
                                                                <option value="27">27</option>
                                                                <option value="28">28</option>
                                                                <option value="29">29</option>
                                                            </select>
                                                            <a href="?c=index&amp;page=2" class="next" title="下一页"></a>
                                                            <a href="?c=index&amp;page=29" class="last" title="最末页"></a>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>

                    </div>
                </div>
            </div>

            <!-- 尾部 -->
            <div class="foot huibg">
                <script>$(".foot").load("foot.html");</script>
            </div>
        </div>

    </div>
    </div>
    <script src="js/layui/layui.all.js"></script>
    <script>
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            laydate.render({
                elem: '#test16'
                , range: true
            });
        })
    </script>
    <script>
        var myChart3 = echarts.init(document.getElementById('Vip'));
        var option = {
            title: {
                text: '任务类型图',
                textStyle: {
                    textAlign: 'center',
                    fontSize: 14,
                    fontStyle: 'normal',
                    // fontWeight: 'normal',
                },
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b}: {c} ({d}%)'
            },
            series: [
                {
                    name: '任务数量',
                    type: 'pie',
                    radius: ['30%', '60%'],
                    avoidLabelOverlap: false,
                    label: {
                        show: false,
                        position: 'center'
                    },
                    itemStyle: {
                        normal: {
                            label: {
                                show: true,
                                formatter: '{b} : {c} ({d}%)'
                            },
                            labelLine: { show: true }
                        }
                    },
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '20',
                            fontWeight: 'bold'
                        }
                    },
                    labelLine: {
                        show: false
                    },
                    data: [
                        { value: 4, name: '设计方案', itemStyle: { color: '#87CBFF' } },
                        { value: 8, name: '约稿任务', itemStyle: { color: '#879DFF' } },
                    ]
                }
            ]
        };
        myChart3.setOption(option)
        var myChart4 = echarts.init(document.getElementById('Vips'));
        var options = {
            title: {
                text: '任务类型图',
                textStyle: {
                    textAlign: 'center',
                    fontSize: 14,
                    fontStyle: 'normal',
                    // fontWeight: 'normal',
                },
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b}: {c} ({d}%)'
            },
            series: [
                {
                    name: '积分分布图',
                    type: 'pie',
                    radius: ['30%', '60%'],
                    avoidLabelOverlap: false,
                    label: {
                        show: false,
                        position: 'center'
                    },
                    itemStyle: {
                        normal: {
                            label: {
                                show: true,
                                formatter: '{b} : {c} ({d}%)'
                            },
                            labelLine: { show: true }
                        }
                    },
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '20',
                            fontWeight: 'bold'
                        }
                    },
                    labelLine: {
                        show: false
                    },
                    data: [
                        { value: 75, name: '约稿积分' },
                        { value: 25, name: '方案积分' },
                    ]
                }
            ]
        };
        myChart4.setOption(options)
    </script>
</body>

</html>